import React from 'react';
import { Form } from 'antd';

import DataCard from '@/components/DataCard';
import InfoFormItem from '@/components/InfoFormItem';
import { STYLE_WIDTH } from '@/utils/const';

const DataStat = (props: { loading: boolean; data: any }) => {
  const { loading, data = {} } = props;
  const datas = [
    {
      label: '平台数量',
      value: `${data.up_platforms} 个`,
    },
    {
      label: '推送视频',
      value: `${data.up_platform_devices} 路`,
    },
  ];

  return (
    <DataCard title="数据共享统计（国标输出）" loading={loading}>
      <Form layout="inline">
        {datas.map(item => (
          <InfoFormItem label={item.label} {...STYLE_WIDTH} key={item.label}>
            {item.value}
          </InfoFormItem>
        ))}
      </Form>
    </DataCard>
  );
};

export default DataStat;
